<template>
	<div class="blog-main">
        
        <div class="heading-blog">
            {{post.title}}
        </div>
        <img :src="'http://140.143.58.13:3000'+post.imgPath" class="img-responsive img-rounded" />
        <div class="blog-info">
            <span class="label label-success">{{post.categoryName}}</span>
            <span class="label label-danger">By Leil</span>
            <span class="label label-info">{{post.updateTime}}</span>
        </div>
        <div class="blog-txt" v-html="post.text"></div>
    </div>
                        
</template>

<script>

import marked from "marked"

export default {

    data() {
        return {
            post: []
        }
    },
	mounted: function() {
        this.getPostInfo()
	},
	methods: {
        getPostInfo: function() {
            this.$axios.get(`/api/getPostById/${this.$route.params.postId}`)
                    .then(res => {
                        // console.log(res)
                        res.data.text = marked(res.data.text)
                        this.post = res.data
                    })
                    .catch(error => {
                        console.log(error)
                    })
        }
		
	}
}
</script>